<template style="#f0f2f5">
  <div class="personal-center">
    <div class="header-content">
      <div class="header-left">
        <div class="user-logo" style="position: relative;">
          <!-- <img :src="userInfo.imgUrl" alt /> -->
        </div>
        <div class="fl">
          <p>早安,{{ userInfo.userName }},祝你开心每一天！</p>
          <p>
            <span>{{ userInfo.userRole }}</span>
            &nbsp;&nbsp;&nbsp;&nbsp;|
            <span>{{ userInfo.userBussiness }}</span>
          </p>
        </div>
      </div>

      <div class="user-info" style="margin: 0;">
        <div class="fr-three">
          <p>我的星级</p>
          <p>
            <Icon type="md-star" style="margin-right: -10px" />
            ×{{ starTotal }}
          </p>
        </div>
        <div class="line"></div>
        <div class="fr-two">
          <p>当前排名</p>
          <p>
            <span class="ranking-one">{{ myRank }}</span>
            <span class="ranking-two">&nbsp;&nbsp;/&nbsp;&nbsp;{{ allRank }}</span>
          </p>
        </div>
        <div class="line"></div>
        <div class="fr-one">
          <p>当前俱乐部</p>
          <p v-if="clubName != ''">
            <span>{{ clubName }}</span>
          </p>
          <p v-if="clubName == ''" style="line-height: 80px">
            <span>{{ clubName }}</span>
          </p>
        </div>
      </div>
    </div>
    <div style="margin-top: 20px">
      <!-- 左边模块 -->
      <!-- <Row :gutter="18" style="margin-top:18px"> -->
      <!-- </Row> -->

      <div class="mode-left">
        <Card style="margin-bottom: 20px;height: 100%;" class="card-div">
          <p slot="title">{{ month }}月达成率</p>
          <a href="#" slot="extra" @click="$router.push({path:'/U/statisticalAnalysis/achievementRate'})">更多</a>
          <!-- <div class="top-box box-title">
            <span class="line">
            </span>
            <span style="font-size: 16px;font-weight: 600;color: #1D1D1D;">{{ month }}月达成率</span>
            <div class="more" @click="$router.push('/statisticalAnalysis/achievementRate')">
              <span>更多</span>
              <Icon type="ios-arrow-forward" />
            </div>
          </div> -->

          <div class="radio-box">
            <!-- radio = 1 -->
            <div @click="radioCli(1)" :class="{ 'active': radio == 1 }">保费</div>
            <div @click="radioCli(2)" :class="{ 'active': radio == 2 }" style="margin-left:10px">件数</div>
          </div>

          <div class="echarts-box">
            <div v-for="(item, index) in achievementRateList" :key="index" class="echarts-item">
              <div :id="'achievementRate' + index" style="width:157px;height:157px;"></div>
              <div class="echarts-byte">
                <span style="color: #999"><span :class="['crl', 'achievementRate' + index]"></span> 实收{{ radio == 1 ? '保费'
                  :
                  '件数' }}</span>
                <span>{{ item[radio == 1 ? 'allReceipts' : 'allReceiptCount'] || 0 }}{{ radio == 1 ? '元' :
                  '件' }}</span>
              </div>
              <div class="echarts-byte">
                <span style="color: #999">应收{{ radio == 1 ? '保费' :
                  '件数' }}</span>
                <span>{{ item[radio == 1 ? 'allReceivables' : 'allReceivableCount'] || 0 }}{{ radio == 1 ? '元' :
                  '件' }}</span>
              </div>
              <div class="echarts-byte">
                <span style="color: #999">预估达成率</span>
                <span>{{ item[radio == 1 ? 'allEsArPremium' : 'allEsArCount'] }}</span>
              </div>
            </div>
          </div>
        </Card>
        <!-- 今日待处理 -->
        <Card style="margin-bottom: 20px; max-height: 580px">
          <p slot="title">今日待处理业务</p>
          <a href="#" slot="extra" @click="changeLimit1">前往工作池</a>
          <Card style="border: 0" v-if="poolState">
            <Menu mode="horizontal" :theme="theme1" active-name="1" @on-select="onSelectChange">
              <MenuItem name="1">
              督导件
              <Badge :count="total1"></Badge>
              </MenuItem>
              <MenuItem name="2">
              收费件
              <Badge :count="total2"></Badge>
              </MenuItem>
              <MenuItem name="3">
              失效件
              <Badge :count="total3"></Badge>
              </MenuItem>
              <MenuItem name="0">
              关爱件
              <Badge :count="total0"></Badge>
              </MenuItem>
              <MenuItem name="4">
              交办件
              <Badge :count="total4"></Badge>
              </MenuItem>
            </Menu>
            <br />
            <!-- 督导件   supervise -->
            <div v-if="selectName == 1">
              <Alert type="warning" show-icon v-if="supervisor != 0">有{{ supervisor }}件超时未处理！</Alert>
              <Table ref="selection" :row-class-name="rowClassName" :columns="columns1" :data="data1"
                @on-selection-change="selectionChange1" height="318">
                <template slot-scope="{ row }" slot="deal">
                  <p class="btn-deal" @click="btnDeal(row, 'supervise')">
                    处理
                  </p>
                </template>
              </Table>
              <!-- 分页 -->
              <!-- <Row>
                <i-col span="24" style="text-align:right;margin-top:20px">
                  <Page :total="total1" show-total :page-size="pageSize" @on-change="indexChange1" />
                </i-col>
              </Row>-->
            </div>
            <!-- 收费件  charge -->
            <div v-if="selectName == 2">
              <Alert type="warning" show-icon v-if="orphan != 0">有{{ orphan }}件超时未处理！</Alert>
              <Table ref="selection" :row-class-name="rowClassName" :columns="columns2" :data="data2"
                @on-selection-change="selectionChange2" height="318">
                <template slot-scope="{ row }" slot="deal">
                  <p class="btn-deal" @click="btnDeal(row, 'charge')">处理</p>
                </template>
              </Table>
              <!-- 分页 -->
              <!-- <Row>
                <i-col span="24" style="text-align:right;margin-top:20px">
                  <Page :total="total2" show-total :page-size="pageSize" @on-change="indexChange2" />
                </i-col>
              </Row>-->
            </div>
            <!-- 失效件  disabled -->
            <div v-if="selectName == 3">
              <Alert type="warning" show-icon v-if="invalid != 0">有{{ invalid }}件超时未处理！</Alert>
              <Table ref="selection" :row-class-name="rowClassName" :columns="columns3" :data="data3"
                @on-selection-change="selectionChange3" height="318">
                <template slot-scope="{ row }" slot="deal">
                  <p class="btn-deal" @click="btnDeal(row, 'disabled')">处理</p>
                </template>
              </Table>
              <!-- <Row>
                <i-col span="24" style="text-align:right;margin-top:20px">
                  <Page :total="total3" show-total :page-size="pageSize" @on-change="indexChange3" />
                </i-col>
              </Row>-->
            </div>
            <!-- 交办件  assign -->
            <div v-if="selectName == 4">
              <Alert type="warning" show-icon v-if="handover != 0">有{{ handover }}件超时未处理！</Alert>
              <Table ref="selection" :row-class-name="rowClassName" :columns="columns4" :data="data4"
                @on-selection-change="selectionChange4" height="318">
                <template slot-scope="{ row }" slot="deal">
                  <p class="btn-deal" @click="btnDeal(row, 'assign')">处理</p>
                </template>
              </Table>
              <!-- <Row>
                <i-col span="24" style="text-align:right;margin-top:20px">
                  <Page :total="total4" show-total :page-size="pageSize" @on-change="indexChange4" />
                </i-col>
              </Row>-->
            </div>
            <!-- 关爱件  disabled -->
            <!-- <div v-if="selectName == 0">
              <Alert type="warning" show-icon v-if="invalid1 != 0">有{{ invalid1 }}件超时未处理！</Alert>
              <Table ref="selection" :row-class-name="rowClassName" :columns="columns0" :data="data0"
                @on-selection-change="selectionChange3" height="318">
                <template slot-scope="{ row }" slot="deal">
                  <p class="btn-deal" @click="btnDeal1(row, 'care')">处理</p>
                </template>
              </Table>
            </div> -->
          </Card>
          <div style="
              border: 0;
              color: rgba(0, 0, 0, 0.45);
              font-size: 16px;
              text-align: center;
              heigth: 610px;
              line-height: 610px;
            " v-if="!poolState">
            暂无处理！
          </div>
        </Card>
        <!-- 审批通知 -->
        <Card style="margin-bottom: 20px; max-height: 490px">
          <p slot="title">
            审批通知
            <Badge :count="totalA"></Badge>
          </p>
          <a href="#" slot="extra" @click.prevent="changeLimit2">更多</a>
          <!-- 显示前三个，多余的滚动 -->
          <Card style="border: 0; max-height: 400px; overflow-x: hidden" v-if="applyState">
            <div v-for="(item, index) in applicateList" :key="index">
              <!-- 请假 -->
              <div class="apply-block" v-if="item.applyType == '请假'" @click="toDetail(item)" style="cursor: pointer">
                <Row>
                  <i-col span="24">
                    <Row>
                      <i-col span="18">
                        <p style="
                            color: rgba(0, 0, 0, 0.65);
                            font-size: 18px;
                            font-weight: bold;
                          " v-if="item.state == '已驳回'">
                          您的请假申请{{ item.approvaName }}{{ item.state }}
                        </p>
                        <p style="
                            color: rgba(0, 0, 0, 0.65);
                            font-size: 18px;
                            font-weight: bold;
                          " v-if="item.state != '已驳回'">
                          您的请假申请{{ item.state }}
                        </p>
                      </i-col>
                      <i-col span="6">
                        <p class="apply-right">{{ item.updateTime }}</p>
                      </i-col>
                    </Row>

                    <div style="margin: 10px 0">
                      <Row>
                        <i-col span="8">
                          <span style="color: rgba(0, 0, 0, 0.45)">
                            开始时间：{{ item.startTime }}
                            {{ item.startTimeSolt }}
                          </span>
                        </i-col>
                        <i-col span="8">
                          <span style="color: rgba(0, 0, 0, 0.45)">
                            结束时间：{{ item.endTime }}
                            {{ item.endTimeSolt }}
                          </span>
                        </i-col>
                        <i-col span="8">
                          <span style="color: rgba(0, 0, 0, 0.45)">请假类型：{{ item.detail }}</span>
                        </i-col>
                      </Row>
                    </div>
                    <p style="padding-bottom: 10px">
                      请假事由：{{ item.reason }}
                    </p>
                  </i-col>
                </Row>
              </div>
              <!-- 外出 -->
              <div class="apply-block" v-if="item.applyType == '外出'" @click="toDetail(item)" style="cursor: pointer">
                <Row>
                  <i-col span="24">
                    <Row>
                      <i-col span="18">
                        <p style="
                            color: rgba(0, 0, 0, 0.65);
                            font-size: 18px;
                            font-weight: bold;
                          " v-if="item.state == '已驳回'">
                          您的外出申请{{ item.approvaName }}{{ item.state }}
                        </p>
                        <p style="
                            color: rgba(0, 0, 0, 0.65);
                            font-size: 18px;
                            font-weight: bold;
                          " v-if="item.state != '已驳回'">
                          您的外出申请{{ item.state }}
                        </p>
                      </i-col>
                      <i-col span="6">
                        <p class="apply-right">{{ item.updateTime }}</p>
                      </i-col>
                    </Row>
                    <div style="margin: 10px 0">
                      <Row>
                        <i-col span="8">
                          <span style="color: rgba(0, 0, 0, 0.45)">
                            开始时间：{{ item.startTime }}
                            <!-- {{ item.startTimeSolt }} -->
                          </span>
                        </i-col>
                        <i-col span="8">
                          <span style="color: rgba(0, 0, 0, 0.45)">
                            结束时间：{{ item.endTime }}
                            <!-- {{ item.endTimeSolt }} -->
                          </span>
                        </i-col>
                        <i-col span="8">
                          <span style="color: rgba(0, 0, 0, 0.45)">外出地点：{{ item.place }}</span>
                        </i-col>
                      </Row>
                    </div>
                    <p style="padding-bottom: 10px">
                      外出事由：{{ item.reason }}
                    </p>
                  </i-col>
                </Row>
              </div>
              <!-- 补卡 -->
              <div class="apply-block" v-if="item.applyType == '补卡'" @click="toDetail(item)" style="cursor: pointer">
                <Row>
                  <i-col span="24">
                    <Row>
                      <i-col span="18">
                        <p style="
                            color: rgba(0, 0, 0, 0.65);
                            font-size: 18px;
                            font-weight: bold;
                          " v-if="item.state == '已驳回'">
                          您的补卡申请{{ item.approvaName }}{{ item.state }}
                        </p>
                        <p style="
                            color: rgba(0, 0, 0, 0.65);
                            font-size: 18px;
                            font-weight: bold;
                          " v-if="item.state != '已驳回'">
                          您的补卡申请{{ item.state }}
                        </p>
                      </i-col>
                      <i-col span="6">
                        <p class="apply-right">{{ item.updateTime }}</p>
                      </i-col>
                    </Row>
                    <div style="margin: 10px 0">
                      <Row>
                        <i-col span="8">
                          <span style="color: rgba(0, 0, 0, 0.45)">补卡类型：{{ item.detail }}</span>
                        </i-col>
                        <i-col span="8">
                          <span style="color: rgba(0, 0, 0, 0.45)" v-if="item.clockInDate">
                            上班补卡时间：{{ item.clockInDate }}
                            {{ item.clockInTime }}
                          </span>
                        </i-col>
                        <i-col span="8">
                          <span style="color: rgba(0, 0, 0, 0.45)" v-if="item.clockOutDate">
                            下班补卡时间：{{ item.clockOutDate }}
                            {{ item.clockOutTime }}
                          </span>
                        </i-col>
                      </Row>
                    </div>
                    <p style="padding-bottom: 10px">
                      补卡事由：{{ item.reason }}
                    </p>
                  </i-col>
                </Row>
              </div>
            </div>
          </Card>
          <div style="
              border: 0;
              color: rgba(0, 0, 0, 0.45);
              font-size: 16px;
              text-align: center;
              heigth: 350px;
              line-height: 350px;
            " v-if="!applyState || applicateList.length == 0">
            暂无通知！
          </div>
        </Card>
        <!-- 领导评价 -->
        <Card style="margin-bottom: 20px; max-height: 490px">
          <p slot="title">
            领导评价
            <Badge :count="totalC"></Badge>
          </p>
          <a href="#" slot="extra" @click.prevent="changeLimit1">更多</a>
          <Card style="border: 0; max-height: 392px; overflow-x: hidden" v-if="poolState">
            <div class="apply-block" v-for="(item, index) in indexComment" :key="index" :value="item">
              <Row>
                <i-col span="2">
                  <div class="apply-img">
                    <img :src="item.photoUrl" alt />
                  </div>
                </i-col>
                <i-col span="22">
                  <div>
                    <Row>
                      <i-col span="16">
                        <span style="font-weight: bold; font-size: 18px">
                          {{ item.commentname }}
                        </span>
                        <span>对您的{{ item.constate }}</span>
                        <a style="color: rgba(24, 144, 255, 1); cursor: pointer" @click="linkContnoDetail(item)">{{
                          item.contno }}</a>
                        <span>给出了评价</span>
                      </i-col>
                      <i-col offset="16">
                        <div class="apply-right">{{ item.createTime }}</div>
                      </i-col>
                    </Row>
                  </div>
                  <div>
                    <span style="color: rgba(0, 0, 0, 0.45)">
                      评价等级：
                      <Rate disabled v-model="item.level" />
                    </span>
                  </div>
                  <p>评价内容：{{ item.comment }}</p>
                </i-col>
              </Row>
            </div>
          </Card>
          <div style="
              border: 0;
              color: rgba(0, 0, 0, 0.45);
              font-size: 16px;
              text-align: center;
              heigth: 350px;
              line-height: 350px;
            " v-if="!poolState || indexComment.length == 0">
            暂无通知！
          </div>
        </Card>
      </div>
      <!-- 右边模块 -->
      <div class="mode-right">
        <!-- 系统通知 -->
        <Card style="margin-bottom: 20px; min-height: 240px">
          <p slot="title">
            系统通知
            <Badge :count="sysTotal"></Badge>
          </p>
          <div class="sys-body">
            <div v-for="(item, index) in sysMsg" :key="index">
              <Row :gutter="16">
                <i-col span="1">
                  <p style="color: rgba(24, 144, 255, 1)">
                    <Icon type="ios-radio-button-on" />
                  </p>
                </i-col>
                <i-col span="16">
                  <p style="padding-left: 10px">
                    {{ item.message[0] }}
                    <span v-if="item.message[1]">
                      <a @click="linkBtn(item.message[1])">【{{ item.message[1] }}】</a>
                      {{ item.message[2] }}
                    </span>
                    <span v-if="item.message[3]">
                      <a @click="linkBtn(item.message[3])">【{{ item.message[3] }}】</a>
                      {{ item.message[4] }}
                    </span>
                  </p>
                </i-col>
                <i-col span="6">
                  <p style="color: rgba(0, 0, 0, 0.45)">{{ item.datetime }}</p>
                </i-col>
              </Row>
            </div>
          </div>
          <!-- <div style="border:0; color:rgba(0,0,0,0.45); font-size: 16px; text-align:center; heigth:240px; line-height:240px;" v-if="sysMsg.length == 0">暂无通知！</div> -->
        </Card>
        <!-- 会议通知 -->
        <Card style="margin-bottom: 20px; min-height: 400px">
          <p slot="title">
            会议通知
            <Badge :count="meetTotal"></Badge>
          </p>
          <a href="#" slot="extra" @click.prevent="toMeet">更多</a>
          <div class="meet-body">
            <div v-for="(item, index) in meetMsg" :key="index" style="cursor: pointer">
              <Row>
                <i-col span="20">
                  <div @click="goMeetDetail(item)">
                    <div v-if="item.meetingtype == '会议进行中'">
                      <Tag color="primary">{{ item.meetingtype }}</Tag>
                    </div>
                    <div v-if="item.meetingtype == '会议未开始'">
                      <Tag color="warning">{{ item.meetingtype }}</Tag>
                    </div>
                    <div class="cardFile">{{ item.theme }}</div>
                    <div style="color: rgba(0, 0, 0, 0.45)">
                      <div class="cardFile">
                        <Icon type="ios-time" />
                        &nbsp;{{ item.date }}&nbsp;{{ item.starttime }} -
                        {{ item.endtime }}
                      </div>
                      <div class="cardFile">
                        <Icon type="ios-pin" />
                        &nbsp;{{ item.address }}
                      </div>
                      <div>
                        <Row>
                          <i-col span="24" class="cardFile">
                            <Icon type="ios-document" />
                            &nbsp;{{ item.filename }}
                          </i-col>
                        </Row>
                      </div>
                    </div>
                  </div>
                </i-col>
                <i-col span="4" v-if="item.joinFlag == 0" style="height: 172px; line-height: 252px">
                  <Button type="primary" size="small" @click="meetSure(item, index)">确认</Button>
                </i-col>
              </Row>
              <Divider></Divider>
            </div>
          </div>

          <!-- <div
            style="border:0; color:rgba(0,0,0,0.45); font-size: 16px; text-align:center; heigth:400px; line-height:400px;"
            v-if="!meetingState"
          >
            暂无数据！
          </div>-->
        </Card>
        <!-- 培训通知 -->
        <Card style="margin-bottom: 20px; min-height: 400px">
          <p slot="title">
            培训通知
            <Badge :count="trainTotal"></Badge>
          </p>
          <a href="#" slot="extra" @click.prevent="toTrain">更多</a>
          <!-- <div class="train-body">
            <div v-for="(item, index) in trainMsg" :key="index" style="cursor: pointer" @click="goTrainDetail(item)">
              <div v-if="item.traintype == '考核未结束'">
                <Tag color="primary">{{ item.traintype }}</Tag>
                <div class="cardFile">{{ item.theme }}</div>
                <div style="color: rgba(0, 0, 0, 0.45)">
                  <div>
                    <Icon type="md-calendar" />
                    &nbsp;
                    {{ item.maketime }}
                  </div>
                  <div>
                    <Row>
                      <i-col span="20" class="cardFile">
                        <Icon type="ios-document" />
                        &nbsp;{{ item.filename }}
                      </i-col>
                    </Row>
                  </div>
                  <div class="cardFile">
                    <Icon type="ios-time" />
                    &nbsp;{{ item.startdate }} ~ {{ item.enddate }}
                  </div>
                </div>
                <Divider></Divider>
              </div>
              <div v-if="item.traintype == '考核已结束'">
                <Tag color="#e5e5e5" class="endTag">{{ item.traintype }}</Tag>
                <div class="cardFile">{{ item.theme }}</div>
                <div style="color: rgba(0, 0, 0, 0.45)">
                  <div>
                    <Icon type="md-calendar" />
                    &nbsp;
                    {{ item.maketime }}
                  </div>
                  <div>
                    <Row>
                      <i-col span="20" class="cardFile">
                        <Icon type="ios-document" />
                        &nbsp;{{ item.filename }}
                      </i-col>
                    </Row>
                  </div>
                  <div class="cardFile">
                    <Icon type="ios-time" />
                    &nbsp;{{ item.startdate }} ~ {{ item.enddate }}
                  </div>
                </div>
                <Divider></Divider>
              </div>
              <div v-if="item.traintype == '无考核'">
                <Tag color="warning">{{ item.traintype }}</Tag>
                <div class="cardFile">{{ item.theme }}</div>
                <div style="color: rgba(0, 0, 0, 0.45)">
                  <div>
                    <Icon type="md-calendar" />
                    &nbsp;
                    {{ item.maketime }}
                  </div>
                  <div>
                    <Row>
                      <i-col span="20" class="cardFile">
                        <Icon type="ios-document" />
                        &nbsp;{{ item.filename }}
                      </i-col>
                    </Row>
                  </div>
                </div>
                <Divider></Divider>
              </div>
            </div>
          </div> -->

          <!-- <div
            style="border:0; color:rgba(0,0,0,0.45); font-size: 16px; text-align:center; heigth:400px; line-height:400px;"
            v-if="!planState"
          >
            暂无数据！
          </div>-->
        </Card>
      </div>
    </div>
    <div style="clear: both"></div>

    <!-- 修改密码 -->
    <Modal v-model="resetpwd" title="首次登陆请修改密码" :closable="false" footer-hide="true" class="pswModal"
      :mask-closable="false">
      <Form ref="formPsw" :model="updatePasswordInfo" :rules="pswRules">
        <Row>
          <i-col span="4" style="height:32px; line-height:32px; text-align:right; margin-right:8px;">原密码</i-col>
          <i-col span="16">
            <FormItem prop="oldPassword">
              <i-input type="password" v-model="updatePasswordInfo.oldPassword" placeholder="请输入原密码"></i-input>
            </FormItem>
          </i-col>
        </Row>
        <Row>
          <i-col span="4" style="height:32px; line-height:32px; text-align:right; margin-right:8px;">新密码</i-col>
          <i-col span="16">
            <FormItem prop="newPassword">
              <i-input type="password" v-model="updatePasswordInfo.newPassword" placeholder="请输入新密码"></i-input>
            </FormItem>
          </i-col>
        </Row>
        <Row>
          <i-col span="4" style="height:32px; line-height:32px; text-align:right; margin-right:8px;">确认新密码</i-col>
          <i-col span="16">
            <FormItem prop="confirmPassword">
              <i-input type="password" v-model="updatePasswordInfo.confirmPassword" placeholder="请再次新输入新密码"></i-input>
            </FormItem>
          </i-col>
        </Row>
        <Row>
          <i-col span="24" style="margin-top:10px; text-align:right;">
            <FormItem>
              <Button type="primary" style="margin-right:20px" @click="updatePassword">确定</Button>
              <!-- <Button @click="pswCancel">取消</Button> -->
            </FormItem>
          </i-col>
        </Row>
      </Form>
    </Modal>
  </div>
</template>

<script>
// import { routers, appRouter } from "./../../router";
import Cookies from "js-cookie";
const echarts = require("echarts");
export default {
  data() {
    //长度至少8位且包含数字字母
    const validatorLength = (rule, value, callback) => {
      let accountReg = /^(?=.*[A-Za-z])(?=.*[0-9])(?=.*[~!@#$%^&*()_+|<>,.?/\\:;'\[\]{}\"\-]).{8,}$/
      if (value != '' && value.match(accountReg) == null) {
        callback(new Error('长度至少8位含字母,数字,特殊字符'))
      } else {
        callback()
      }
    }
    // 两次密码相同校验
    const validatorPsw = (rule, value, callback) => {
      if (this.updatePasswordInfo.confirmPassword !== "") {
        this.$refs.formPsw.validateField("confirmPassword");
        callback();
      } else if (this.updatePasswordInfo.confirmPassword !== "") {
        this.$refs.formPsw.validateField("confirmPassword");
        callback();
      } else {
        callback();
      }
    };
    // 两次密码相同校验
    const validatorResetPsw = (rule, value, callback) => {
      if (
        this.updatePasswordInfo.newPassword !== "" &&
        value !== this.updatePasswordInfo.newPassword
      ) {
        callback("两次输入密码不匹配");
      } else if (
        this.updatePasswordInfo.newPassword !== "" &&
        value !== this.updatePasswordInfo.newPassword
      ) {
        callback("两次输入密码不匹配");
      } else {
        callback();
      }
    };

    return {
      radio: 1,
      month: "",
      achievementRateList: [{}, {}, {}],
      option: {
        // tooltip: {
        //   trigger: "item",
        // },
        color: ["#F8F8F8"], // "#F88D67"
        series: [
          {
            type: "pie",
            radius: ["75%", "90%"],
            avoidLabelOverlap: true,
            label: {
              show: true,
              fontSize: 16,
              fontWeight: "bold",
              position: "center",
              formatter: "", // 48%\n当月达成率
            },
            emphasis: {
              label: {
                show: true,
                fontSize: 16,
                fontWeight: "bold",
                formatter: "", // 48%\n当月达成率
              },
            },
            // data: [{ value: 0.48, name: "当月达成率" }, { value: 0.52 }],
          },
        ],
      },
      color: ["#F88D67", "#58CA86", "#A09FFF"],
      userInfo: {
        userName: "",
        userRole: "",
        userBussiness: "",
        imgUrl: "",
        userCode: "",
      },
      theme1: "light",
      columns1: [
        {
          type: "selection",
          width: 60,
          align: "center",
          fixed: "left",
        },
        {
          title: "保单号",
          key: "contno",
          fixed: "left",
          minWidth: 180,
        },
        {
          title: "投保人",
          key: "appntname",
          align: "center",
          minWidth: 120,
        },
        {
          title: "应交日",
          key: "paytodate",
          align: "center",
          minWidth: 180,
        },
        {
          title: "应收保费（元）",
          key: "paymoney",
          align: "center",
          minWidth: 120,
        },
        {
          title: "宽限期剩余天数",
          key: "restdays",
          align: "center",
          minWidth: 100,
        },
        {
          title: "工作计划方式",
          key: "worktypename",
          align: "center",
          minWidth: 140,
        },
        {
          title: "业务员",
          key: "agentname",
          align: "center",
          minWidth: 160,
        },
        {
          title: "批量处理",
          key: "deal",
          align: "center",
          width: 120,
          fixed: "right",
          slot: "deal",
          renderHeader: (h, params) => {
            return h(
              "button",
              {
                style: {
                  width: "80px",
                  height: "30px",
                  color: "white",
                  backgroundColor: "rgba(24, 144, 255, 1)",
                  border: "0",
                  borderRadius: "4px",
                },
                on: {
                  click: () => {
                    if (this.selectLength1 <= 0) {
                      this.$Message.info("未选择计划，不可进行此操作");
                      return;
                    }
                    let i = 0;
                    this.selection1.some(function (element) {
                      if (element.planstatename == "已完成") {
                        return true;
                      } else {
                        i++;
                      }
                    });
                    if (i === this.selectLength1) {
                      let selectionCopy = [];
                      let j = 0;
                      this.selection1.forEach((element) => {
                        if (selectionCopy.includes(element.appntid)) {
                          j++;
                        } else {
                          selectionCopy.push(element.appntid);
                        }
                      });
                      if (j === this.selectLength1 - 1) {
                        this.$router.push({
                          // name: "batchDeal",
                          path: "/U/businessManagement/batchDeal",
                          query: {
                            selection: this.selection1,
                            insuranceType: "supervise",
                          },
                        });
                      } else {
                        this.$Message.info("批量处理中投保人编号必须相同");
                      }
                    } else {
                      this.$Message.info("计划中不能包含已完成的计划");
                    }
                  },
                },
              },
              "批量处理"
            );
          },
        },
      ],
      data1: [],
      selection1: [],
      selectLength1: 0,
      columns2: [
        {
          type: "selection",
          width: 60,
          align: "center",
          fixed: "left",
        },
        {
          title: "保单号",
          key: "contno",
          fixed: "left",
          minWidth: 180,
        },
        {
          title: "投保人",
          key: "appntname",
          align: "center",
          minWidth: 120,
        },
        {
          title: "应交日",
          key: "paytodate",
          align: "center",
          minWidth: 180,
        },
        {
          title: "应收保费（元）",
          key: "paymoney",
          align: "center",
          minWidth: 120,
        },
        {
          title: "宽限期剩余天数",
          key: "restdays",
          align: "center",
          minWidth: 100,
        },
        {
          title: "工作计划方式",
          key: "worktypename",
          align: "center",
          minWidth: 140,
        },
        {
          title: "业务员",
          key: "agentname",
          align: "center",
          minWidth: 160,
        },
        {
          title: "批量处理",
          key: "deal",
          align: "center",
          width: 120,
          fixed: "right",
          slot: "deal",
          renderHeader: (h, params) => {
            return h(
              "button",
              {
                style: {
                  width: "80px",
                  height: "30px",
                  color: "white",
                  backgroundColor: "rgba(24, 144, 255, 1)",
                  border: "0",
                  borderRadius: "4px",
                },
                on: {
                  click: () => {
                    if (this.selectLength2 <= 0) {
                      this.$Message.info("未选择计划，不可进行此操作");
                      return;
                    }
                    let i = 0;
                    this.selection2.some(function (element) {
                      if (element.planstatename == "已完成") {
                        return true;
                      } else {
                        i++;
                      }
                    });
                    if (i === this.selectLength2) {
                      let selectionCopy = [];
                      let j = 0;
                      this.selection2.forEach((element) => {
                        if (selectionCopy.includes(element.appntid)) {
                          j++;
                        } else {
                          selectionCopy.push(element.appntid);
                        }
                      });
                      if (j === this.selectLength2 - 1) {
                        this.$router.push({
                          path: "/U/businessManagement/batchDeal",
                          query: {
                            selection: this.selection2,
                            insuranceType: "charge",
                          },
                        });
                      } else {
                        this.$Message.info("批量处理中投保人编号必须相同");
                      }
                    } else {
                      this.$Message.info("计划中不能包含已完成的计划");
                    }
                  },
                },
              },
              "批量处理"
            );
          },
        },
      ],
      data2: [],
      selection2: [],
      selectLength2: 0,
      columns3: [
        {
          type: "selection",
          width: 60,
          align: "center",
          fixed: "left",
        },
        {
          title: "保单号",
          key: "contno",
          fixed: "left",
          minWidth: 180,
        },
        {
          title: "投保人",
          key: "appntname",
          align: "center",
          minWidth: 120,
        },
        {
          title: "应交日",
          key: "paytodate",
          align: "center",
          minWidth: 180,
        },
        {
          title: "应收保费（元）",
          key: "paymoney",
          align: "center",
          minWidth: 120,
        },
        {
          title: "宽限期剩余天数",
          key: "restdays",
          align: "center",
          minWidth: 100,
        },
        {
          title: "工作计划方式",
          key: "worktypename",
          align: "center",
          minWidth: 140,
        },
        {
          title: "业务员",
          key: "agentname",
          align: "center",
          minWidth: 160,
        },
        {
          title: "操作",
          key: "deal",
          align: "center",
          width: 120,
          fixed: "right",
          slot: "deal",
        },
      ],
      data3: [],
      columns0: [
        {
          type: "selection",
          width: 60,
          align: "center",
          fixed: "left",
        },
        {
          title: "保单号",
          key: "contno",
          fixed: "left",
          minWidth: 180,
        },
        {
          title: "投保人",
          key: "appntname",
          align: "center",
          minWidth: 120,
        },
        {
          title: "生效日",
          key: "cvalidate",
          align: "center",
          minWidth: 180,
        },
        {
          title: "保费（元）",
          key: "paymoney",
          align: "center",
          minWidth: 120,
        },
        {
          title: "工作计划方式",
          key: "worktypename",
          align: "center",
          minWidth: 140,
        },
        {
          title: "业务员",
          key: "agentname",
          align: "center",
          minWidth: 160,
        },
        {
          title: "操作",
          key: "deal",
          align: "center",
          width: 120,
          fixed: "right",
          slot: "deal",
        },
      ],
      data0: [],
      selection3: [],
      selectLength3: 0,
      columns4: [
        {
          type: "selection",
          width: 60,
          align: "center",
          fixed: "left",
        },
        {
          title: "保单号",
          key: "contno",
          fixed: "left",
          minWidth: 180,
        },
        {
          title: "投保人",
          key: "appntname",
          align: "center",
          minWidth: 120,
        },
        {
          title: "应交日",
          key: "paytodate",
          align: "center",
          minWidth: 180,
        },
        {
          title: "应收保费（元）",
          key: "paymoney",
          align: "center",
          minWidth: 120,
        },
        {
          title: "宽限期剩余天数",
          key: "restdays",
          align: "center",
          minWidth: 100,
        },
        {
          title: "工作计划方式",
          key: "worktypename",
          align: "center",
          minWidth: 140,
        },
        {
          title: "业务员",
          key: "agentname",
          align: "center",
          minWidth: 160,
        },
        {
          title: "操作",
          key: "deal",
          align: "center",
          width: 120,
          fixed: "right",
          slot: "deal",
        },
      ],
      data4: [],
      selection4: [],
      selectLength4: 0,
      // 分页数
      total1: 0,
      total2: 0,
      total3: 0,
      total4: 0,
      total0: 0,
      pageIndex1: 1,
      pageIndex2: 1,
      pageIndex3: 1,
      pageIndex4: 1,
      pageSize: 500,
      // 切换视图名称
      selectName: "1",
      // 审批通知
      applicateList: [],
      totalA: 0,
      // 评价内容
      indexComment: [],
      totalC: 0,
      // 系统通知
      sysMsg: [],
      sysTotal: "",
      // 会议通知
      meetMsg: [],
      meetTotal: "",
      // 培训通知
      trainMsg: [],
      trainTotal: "",
      // 知识库
      knowledgeList: [],
      totalK: 0,
      // 超时件
      supervisor: 0,
      orphan: 0,
      invalid: 0,
      invalid1: 0,
      handover: 0,
      // 用户菜单
      menuList: [],
      // 菜单显示状态
      poolState: false,
      applyState: false,
      meetingState: false,
      planState: false,
      knowledgeState: false,
      // 首部----俱乐部，排名，星级
      starTotal: 0,
      clubName: "",
      myRank: 0,
      allRank: 0,
      resetpwd: false,
      updatePasswordInfo: {
        newPassword: "",
        confirmPassword: "",
        oldPassword: ""
      },
      pswRules: {
        newPassword: [
          { required: true, message: "新密码不能为空", trigger: "blur" },
          { required: true, message: "新密码不能为空", trigger: "change" },
          // { validator: validatorAccount, trigger: "blur" },
          // { validator: validatorAccount, trigger: "change" },
          { validator: validatorLength, trigger: 'blur' },
          { validator: validatorLength, trigger: 'change' },
          { validator: validatorPsw, trigger: "blur" },
          { validator: validatorPsw, trigger: "change" }
        ],
        confirmPassword: [
          {
            required: true,
            message: "再次输入新密码不能为空",
            trigger: "blur"
          },
          {
            required: true,
            message: "再次输入新密码不能为空",
            trigger: "change"
          },
          // { validator: validatorAccount, trigger: "blur" },
          // { validator: validatorAccount, trigger: "change" },
          { validator: validatorResetPsw, trigger: "blur" },
          { validator: validatorResetPsw, trigger: "change" }
        ],
        oldPassword: [
          { required: true, message: "原始密码不能为空", trigger: "blur" },
          { required: true, message: "原始密码不能为空", trigger: "change" }
        ]
      },
    };
  },
  beforeDestroy() {
    window.removeEventListener("resize", this.listenFun());
  },
  methods: {
    getAchievingRate() {
    let date = new Date(),
      year = date.getFullYear(),
      month = date.getMonth() + 1;

      this.month = year + "-" + (month > 9 ? month : "0" + month);
      this.apiB
        .AllAchievingRateHome({ visitType: "0", analyzeDate: this.month })
        .then((res) => {
          if (res.code == 200) {
            this.achievementRateList = res.data;
            this.radioCli(this.radio, true);
          } else this.$Message.info(res.msg);
        });
    },
    radioCli(n, b) {
      // console.log(b);
      this.radio = n;
      this.achievementRateList.forEach((item, index) => {
        let dataSourcePie = echarts.init(
          document.getElementById("achievementRate" + index)
        );
        let option = JSON.parse(JSON.stringify(this.option));
        option.color.unshift(this.color[index]);
        let type = "",
          listen = "";
        if (index == 0) {
          type = "当月达成率";
          listen = "Month";
        }
        if (index == 1) {
          type = "宽一达成率";
          listen = "Kuanyi";
        }
        if (index == 2) {
          type = "宽末达成率";
          listen = "Kuanmo";
        }

        // item.allArPremium = "20%";
        // item.allArCount = "30%";

        let formatter = `${item[`${n == 1 ? "allArPremium" : "allArCount"}`]
          }\n${type}`;

        option.series[0].label.formatter = formatter;
        option.series[0].emphasis.label.formatter = formatter;
        let num = this.toPoint(
          item[`${n == 1 ? "allArPremium" : "allArCount"}`]
        );
        option.series[0].data = [
          { value: num, name: type },
          { value: 1 - num },
        ];

        console.log("option", option, option.series[0].label.formatter);

        dataSourcePie.setOption(option);
        this[`listen${listen}`] = dataSourcePie;
        if (b) {
          window.addEventListener(
            "resize",
            this.listenFun(this[`listen${listen}`])
          );
        }
      });
    },
    toPoint(percent) {
      var str = percent.replace("%", "");
      str = str / 100;
      return str;
    },
    listenFun(listen) {
      listen.resize();
    },
    // 判断当前用户是否配置该菜单？
    isMatchMenu() {
      if (sessionStorage.getItem("menuList")) {
        this.menuList = sessionStorage.getItem("menuList").split(",");
      }
      // console.log(this.menuList);
      if (this.menuList) {
        for (var i = 0; i < this.menuList.length; i++) {
          // 工作池
          if (this.menuList[i] == "132") {
            this.poolState = true;
          }
          // 我的申请
          if (this.menuList[i] == "122") {
            this.applyState = true;
          }
          // 会议通知
          if (this.menuList[i] == "143") {
            this.meetingState = true;
          }
          // 培训通知
          if (this.menuList[i] == "151") {
            this.planState = true;
          }
        }
      }
    },

    // 系统通知
    getListForSysmessage() {
      this.api.getListForSysmessage().then((res) => {
        // let list1 = [
        //   {
        //     datetime: "2020/03/02",
        //     message:
        //       "A月份存在即将失效保单，其中【工作池-督导件-即将失效保单】X个，【工作池-收费件-即将失效保单】X个，请前往对应工作池进行处理",
        //     title: "工作池"
        //   },
        //   {
        //     datetime: "2020/03/02",
        //     message:
        //       "A月份存在即将失效保单，其中【工作池-督导件-即将失效保单】X个，【工作池-收费件-即将失效保单】X个，请前往对应工作池进行处理",
        //     title: "工作池"
        //   }
        // ];
        // let records = res.data.records.concat(list1);
        let records = res.data.records;
        records.map((item) => {
          item.message = this.splitStr(item.message);
        });
        console.log(records, "系统通知")
        this.sysMsg = records;
        this.sysTotal = res.data.total;
      });
    },

    // 会议通知
    getListForMeeting() {
      this.api.getListForMeeting({ index: 1, pageSize: 500 }).then((res) => {
        let records = res.data.records;
        records.map((item) => {
          if (item.filename == null) {
            item.filename = "暂无附件";
          }
          if (item.startdate) {
            item["date"] = item.startdate.substr(0, 10);
            item["starttime"] = item.startdate.substr(10, 15);
            item["endtime"] = item.startdate.substr(10, 15);
          }
        });
        this.meetMsg = records;
        this.meetTotal = res.data.total;
      });
    },

    // 会议详情
    goMeetDetail(item) {
      this.$router.push({
        path: "/U/meetingManagement/mettingInfo",
        query: {
          item: item,
          meetingFlag: 1,
        },
      });
    },

    // 会议确认
    meetSure(item, index) {
      this.api
        .updateInfoById({ meetSerialNo: item.meetSerialNo })
        .then((res) => {
          if (res.code == 200) {
            this.meetMsg[index].joinFlag = 1;
            // this.$Message.info("会议确认成功");
          } else {
            this.$Message.info("会议确认失败");
          }
        });
    },

    // 会议确认
    meetSure(item, index) {
      this.api
        .updateInfoById({ meetSerialNo: item.meetSerialNo })
        .then((res) => {
          if (res.code == 200) {
            this.meetMsg[index].joinFlag = 1;
            // this.$Message.info("会议确认成功");
          } else {
            this.$Message.info("会议确认失败");
          }
        });
      // console.log(this.meetMsg[index].joinFlag);
    },

    // 培训通知
    getListForTrain() {
      this.api.getListForTrain({ index: 1, pageSize: 500 }).then((res) => {
        let records = res.data.records;
        records.map((item) => {
          if (item.filename == null) {
            item.filename = "暂无附件";
          }
        });
        this.trainMsg = records;
        this.trainTotal = res.data.total;
      });
    },

    // 培训详情
    goTrainDetail(item) {
      let trainflag = "0";
      if (item.traintype == "无考核") {
        trainflag = "0";
      } else if (item.traintype == "考核未结束") {
        trainflag = "1";
      } else if (item.traintype == "考核已结束") {
        trainflag = "2";
      }
      let obj = {
        trainflag: trainflag,
        trainid: item.trainid,
      };
      this.$router.push({
        name: "examResultDetail",
        query: {
          item: obj,
        },
      });
    },

    // 获取用户信息
    getUserInfo() {
      this.api.getUserInfo().then((res) => {
        this.userInfo.userName = res.data.name;
        this.userInfo.userCode = res.data.employeeNO;
        this.userInfo.userRole = res.data.roleName;
        this.userInfo.userBussiness = res.data.managecomName;
        this.userInfo.imgUrl = res.data.employeeIcon;

        this.getOneYearStars();
        this.selectMyClubList();
        this.getAllRanking();
      });
    },

    // 获取俱乐部，排名，星级
    getOneYearStars() {
      let year = new Date();
      let obj = {
        reagentCode: this.userInfo.userCode,
        year: year.getFullYear(),
      };
      let starList = [];
      this.starTotal = 0;
      this.api.getOneYearStars(obj).then((res) => {
        if (res.code == 200) {
          if (res.data) {
            starList = res.data;
            for (var i = 0; i < starList.length; i++) {
              if (starList[i]) {
                if (starList[i].flag == "1") {
                  this.starTotal++;
                }
              }
            }
          }
        } else {
          this.starTotal = 0;
          this.info(res.msg);
        }
      });
    },
    getAllRanking() {
      let date = new Date();
      let toMonth = null;
      if (date.getMonth() + 1 > 9) {
        toMonth = date.getFullYear() + "-" + (date.getMonth() + 1);
      } else {
        toMonth = date.getFullYear() + "-" + ("0" + (date.getMonth() + 1));
      }
      let obj = {
        reagentCode: this.userInfo.userCode,
        yearMonth: toMonth,
      };
      // console.log(obj)
      this.myRank = 0;
      this.allRank = 0;
      this.api.getAllRanking(obj).then((res) => {
        if (res.code == 200) {
          if (res.data) {
            this.myRank = res.data[0][1];
            this.allRank = res.data[1].length;
          }
        } else {
          this.info(res.msg);
          this.myRank = 0;
          this.allRank = 0;
        }
      });
    },
    selectMyClubList() {
      let obj = {
        managecom: this.userInfo.managecom, //续期管理机构
        agentcodeList: this.userInfo.userCode, //续期人员工号
        index: 1,
        pageSize: 500,
      };
      // console.log(obj);
      this.clubName = "";
      this.api.queryClubAllInfo(obj).then((res) => {
        if (res.code == 200) {
          if (res.data.records[0]) {
            this.clubName = res.data.records[0].clubName;
            if (this.clubName) {
              if (this.clubName.length > 5) {
                this.clubName.substr(0, 5);
              }
            }
          }
        } else {
          this.clubName = "";
          this.info(res.msg);
        }
      });
    },

    // 前往工作池
    changeLimit1() {
      // console.log(this.menuList);
      if (this.poolState) {
        if (this.selectName == "0") {
          // console.log(11111111111);
          this.$router.push({
            // name: "careInsert", 关爱件
            path:'/U/businessManagement/workPool'
          });
        } else {
          // console.log(11111111111);
          this.$router.push({
            // name: "workPool",
            path:'/U/businessManagement/workPool'
          });
        }
      }
    },
    // 前往我的申请（审批通知）
    changeLimit2() {
      if (this.applyState) {
        this.$router.push({
          path: "/U/systemManagement/myApplication",
        });
      }
    },
    rowClassName(row, index) {
      let date = new Date(row.appointeddate);
      let tt = new Date();
      let yy = tt.getFullYear();
      let mm = tt.getMonth() + 1;
      if (mm < "10") {
        mm = "0" + mm;
      }
      let dd = tt.getDate();
      let today = new Date(yy + "-" + mm + "-" + dd + " 00:00:00");

      if (
        today.getTime() > date.getTime() &&
        row.appointeddate != null &&
        row.planstate !== "2"
      ) {
        return "demo-table-error-row";
      } else {
        return "demo-table-info-row";
      }
      return "";
    },
    // 督导件查询
    supervisorQuery() {
      let obj = {
        payintv: '',
        initflag: 1,
        selecttype: 0,
        selecttag: 0,
        initqueryflag: 0,
        pageSize: this.pageSize,
        index: this.pageIndex1,
      };
      this.api.getWorkListForSupervisor(obj).then((res) => {
        this.data1 = [];
        if (res.code == 200) {
          if (res.data) {
            this.data1 = res.data.ipage.records;
            this.data1.forEach((element) => {
              let date = new Date(element.appointeddate);
              let tt = new Date();
              let yy = tt.getFullYear();
              let mm = tt.getMonth() + 1;
              if (mm < "10") {
                mm = "0" + mm;
              }
              let dd = tt.getDate();
              let today = new Date(yy + "-" + mm + "-" + dd + " 00:00:00");

              if (
                today.getTime() > date.getTime() &&
                element.planstate !== "2" &&
                element.appointeddate != null
              ) {
                this.supervisor++;
              }
              element.paytodate = element.paytodate.substr(0, 10);
            });
            this.total1 = res.data.ipage.total;
          } else {
            this.data1 = [];
          }
        }
      });
    },
    // 表格多选获取数据
    selectionChange1(selection) {
      this.selection1 = selection;
      this.selectLength1 = selection.length;
      // console.log(this.selection1,this.selectLength1)
    },
    // 收费件查询
    getWorkListForOrphan() {
      let obj = {
        payintv: '',
        initflag: 1,
        selecttype: 1,
        selecttag: 0,
        initqueryflag: 0,
        pageSize: this.pageSize,
        index: this.pageIndex2,
      };
      this.api.getWorkListForOrphan(obj).then((res) => {
        this.data2 = [];
        if (res.code == 200) {
          if (res.data) {
            this.data2 = res.data.ipage.records;
            this.data2.forEach((element) => {
              let date = new Date(element.appointeddate);
              let tt = new Date();
              let yy = tt.getFullYear();
              let mm = tt.getMonth() + 1;
              if (mm < "10") {
                mm = "0" + mm;
              }
              let dd = tt.getDate();
              let today = new Date(yy + "-" + mm + "-" + dd + " 00:00:00");

              if (
                today.getTime() > date.getTime() &&
                element.planstate !== "2" &&
                element.appointeddate != null
              ) {
                this.orphan++;
              }
              element.paytodate = element.paytodate.substr(0, 10);
            });
            this.total2 = res.data.ipage.total;
          } else {
            this.data2 = [];
          }
        }
      });
    },
    // 表格多选获取数据
    selectionChange2(selection) {
      this.selection2 = selection;
      this.selectLength2 = selection.length;
    },
    // 失效件查询
    getWorkListForInvalid() {
      let obj = {
        payintv: '',
        initflag: 1,
        selecttype: 2,
        selecttag: 0,
        initqueryflag: 0,
        pageSize: this.pageSize,
        index: this.pageIndex3,
      };
      this.api.getWorkListForInvalid(obj).then((res) => {
        this.data3 = [];
        if (res.code == 200) {
          if (res.data) {
            this.data3 = res.data.ipage.records;
            this.data3.forEach((element) => {
              let date = new Date(element.appointeddate);
              let tt = new Date();
              let yy = tt.getFullYear();
              let mm = tt.getMonth() + 1;
              if (mm < "10") {
                mm = "0" + mm;
              }
              let dd = tt.getDate();
              let today = new Date(yy + "-" + mm + "-" + dd + " 00:00:00");

              if (
                today.getTime() > date.getTime() &&
                element.planstate !== "2" &&
                element.appointeddate != null
              ) {
                this.invalid++;
              }
              element.paytodate = element.paytodate.substr(0, 10);
            });
            this.total3 = res.data.ipage.total;
          } else {
            this.data3 = [];
          }
        }
      });
    },
    // 关爱件查询
    queryCare() {
      let obj = {
        initflag: 1,
        selecttype: 0,
        selecttag: 0,
        initqueryflag: 0,
        pageSize: this.pageSize,
        index: this.pageIndex3,
      };
      this.api.queryCare(obj).then((res) => {
        this.data0 = [];
        if (res.code == 200) {
          if (res.data) {
            this.data0 = res.data.ipage.records;
            this.data0.forEach((element) => {
              let date = new Date(element.appointeddate);
              let tt = new Date();
              let yy = tt.getFullYear();
              let mm = tt.getMonth() + 1;
              if (mm < "10") {
                mm = "0" + mm;
              }
              let dd = tt.getDate();
              let today = new Date(yy + "-" + mm + "-" + dd + " 00:00:00");

              if (
                today.getTime() > date.getTime() &&
                element.planstate !== "2" &&
                element.appointeddate != null
              ) {
                this.invalid1++;
              }
              element.cvalidate = element.cvalidate.substr(0, 10);
            });
            this.total0 = res.data.ipage.total;
          } else {
            this.data0 = [];
          }
        }
      });
    },
    // 表格多选获取数据
    selectionChange3(selection) {
      this.selection3 = selection;
      this.selectLength3 = selection.length;
    },
    // 交办件查询
    getWorkListForHandover() {
      let obj = {
        payintv: '',
        initflag: 1,
        selecttype: 3,
        selecttag: 0,
        initqueryflag: 0,
        pageSize: this.pageSize,
        index: this.pageIndex4,
      };
      this.api.getWorkListForHandover(obj).then((res) => {
        this.data4 = [];
        if (res.code == 200) {
          if (res.data) {
            this.data4 = res.data.ipage.records;
            this.data4.forEach((element) => {
              let date = new Date(element.appointeddate);
              let tt = new Date();
              let yy = tt.getFullYear();
              let mm = tt.getMonth() + 1;
              if (mm < "10") {
                mm = "0" + mm;
              }
              let dd = tt.getDate();
              let today = new Date(yy + "-" + mm + "-" + dd + " 00:00:00");

              if (
                today.getTime() > date.getTime() &&
                element.planstate !== "2" &&
                element.appointeddate != null
              ) {
                this.handover++;
              }
              if (element.paytodate) {
                element.paytodate = element.paytodate.substr(0, 10);
              }
            });
            // this.total4 = 12;
            this.total4 = res.data.ipage.total;
          } else {
            this.data4 = [];
            this.total4 = 0;
          }
        }
        // console.log(this.total4);
      });
    },
    // 表格多选获取数据
    selectionChange4(selection) {
      this.selection4 = selection;
      this.selectLength4 = selection.length;
    },
    // // 超时件
    // getNumberByuseragentcode() {
    //   this.api.getNumberByuseragentcode().then(res => {
    //     if (res.code == 200 && res.data != null) {
    //       this.supervisor = res.data.supervisor;
    //       this.orphan = res.data.orphan;
    //       this.invalid = res.data.invalid;
    //       this.handover = res.data.handover;
    //     }
    //     // console.log(this.supervisor,this.orphan,this.invalid,this.handover)
    //   });
    // },
    // 处理件
    btnDeal(row, type) {
      if (row.planstatename == "已完成") {
        this.$router.push({
          path: "/U/businessManagement/wpServiceDetail",
          query: {
            row: row,
          },
        });
      } else {
        this.$router.push({
          path: "/U/businessManagement/batchDeal",
          query: {
            selection: row,
            insuranceType: type,
          },
        });
      }
    },
    btnDeal1(row, type) {
      // if (row.planstatename == "已完成") {
      //   this.$router.push({
      //     name: "finished",
      //     query: {
      //       selection: row,
      //     },
      //   });
      // } else {
      //   this.$router.push({
      //     name: "planDeal",
      //     query: {
      //       selection: row,
      //       insuranceType: type,
      //     },
      //   });
      // }
    },
    // 翻页
    // indexChange1(index) {
    //   this.pageIndex1 = index;
    //   this.supervisorQuery();
    // },
    // indexChange2(index) {
    //   this.pageIndex2 = index;
    //   this.getWorkListForOrphan();
    // },
    // indexChange3(index) {
    //   this.pageIndex3 = index;
    //   this.getWorkListForInvalid();
    // },
    // indexChange4(index) {
    //   this.pageIndex4 = index;
    //   this.getWorkListForHandover();
    // },
    // 切换视图
    onSelectChange(name) {
      this.selectName = name;
      // console.log(name);
    },

    // 审批通知
    selectByExample() {
      this.api.getIndexApprova({ index: 1, pageSize: 500 }).then((res) => {
        if (res.code == 200 && res.data != null) {
          this.applicateList = res.data.records;
          this.applicateList.forEach((element) => {
            if (element.reason) {
              if (element.reason.length > 30) {
                let temp = String(element.reason);
                element.reason = temp.substring(0, 30) + "...";
              }
            }
            if (element.place) {
              if (element.place.length > 6) {
                let temp = String(element.place);
                element.place = temp.substring(0, 6) + "...";
              }
            }
            if (element.clockInDate) {
              element.clockInDate = element.clockInDate.substring(0, 10);
            }
            if (element.clockOutDate) {
              element.clockOutDate = element.clockOutDate.substring(0, 10);
            }
            if (element.startTime) {
              element.startTime = element.startTime.substring(0, 10);
            }
            if (element.endTime) {
              element.endTime = element.endTime.substring(0, 10);
            }
          });
          // console.log(this.applicateList);
          this.totalA = res.data.total;
        }
      });
    },
    // 进入详细信息页面
    toDetail(item) {
      this.$router.push({
        path: "/U/systemManagement/applicationDetails",
        query: {
          item: item,
        },
      });
    },

    //领导评价
    getIndexComment() {
      this.api.getIndexComment({ index: 1, pageSize: 500 }).then((res) => {
        if (res.code == 200 && res.data != null) {
          this.indexComment = res.data;
          this.indexComment.forEach((element) => {
            if (element.comment) {
              if (element.comment.length > 30) {
                let temp = String(element.comment);
                element.comment = temp.substring(0, 30) + "...";
              }
            }
          });
          this.totalC = this.indexComment.length;
        } else {
          this.indexComment = [];
          this.totalC = 0;
        }
      });
    },
    // 前往对应的服务详情页
    linkContnoDetail(row) {
      this.$router.push({
        // name: "serviceDetail",
        path:'/U/businessManagement/serviceDetail',
        query: {
          row: row,
        },
      });
    },

    // 前往会议
    toMeet() {
      this.$router.push({
        // name: "mettingMessage",
        path:'/U/meetingManagement/mettingMessage'
      });
    },

    // 前往培训
    toTrain() {
      this.$router.push({
        // name: "examMessage",
        path:'/U/trainManagement/trainIndex'
      });
    },

    // 前往知识库
    // toKnowledage() {
    //   this.$router.push({
    //     name: ""
    //   });
    // },

    // 切割字符串
    splitStr(sysStr) {
      if (sysStr.indexOf("【") != -1) {
        let infoArr = [];
        let sysArr1 = sysStr.split("【");
        infoArr.push(sysArr1[0]);
        sysArr1.forEach((item) => {
          if (item.indexOf("】") != -1) {
            let sysArr2 = item.split("】");
            sysArr2.forEach((item1) => {
              infoArr.push(item1);
            });
          }
        });
        return infoArr;
      } else {
        let infoArr = [];
        infoArr.push(sysStr);
        return infoArr;
      }
    },

    //通知路由跳转
    linkBtn(name) {
      let bus = [];
      let routerNames = [];
      // appRouter.forEach((item) => {
      //   item.children.forEach((i) =>{
      //   if (name.search(item.title) != -1) {
      //     if (name.search("督导件") != -1) {
      //       if (name.search("即将失效保单") != -1) {
      //         this.$router.push({
      //           name: item.name,
      //           query: {
      //             tabIndex: "1",
      //             typeIndex: "3",
      //           },
      //         });
      //         return;
      //       } else {
      //         this.$router.push({
      //           name: item.name,
      //           query: {
      //             tabIndex: "1",
      //           },
      //         });
      //         return;
      //       }
      //     } else if (name.search("收费件") != -1) {
      //       if (name.search("即将失效保单") != -1) {
      //         this.$router.push({
      //           name: item.name,
      //           query: {
      //             tabIndex: "2",
      //             typeIndex: "3",
      //           },
      //         });
      //         return;
      //       } else {
      //         this.$router.push({
      //           name: item.name,
      //           query: {
      //             tabIndex: "2",
      //           },
      //         });
      //         return;
      //       }
      //     } else {
      //       this.$router.push({
      //         name: item.name,
      //       });
      //       return;
      //     }
      //   }
      //     if(i.title === name){
      //       this.$router.push({
      //          name: i.name,
      //       })
      //     }
      //   })
      // });
    },

    //判断是否需要重置密码
    resetPwd() {
      console.log(123456789)
      this.api.checkPassword().then(res => {
        if (res.data == '0') {
          this.resetpwd = true
        }
      })
    },

    updatePassword() {
      this.$refs.formPsw.validate(valid => {
        if (valid) {
          this.api
            .updatePassword({
              newPassword: this.updatePasswordInfo.newPassword,
              oldPassword: this.updatePasswordInfo.oldPassword
            })
            .then(res => {
              if (res.code === 200) {
                this.$Message.info(res.msg);
                setTimeout(() => {
                  Cookies.remove("user");
                  Cookies.remove("password");
                  Cookies.remove("hasGreet");
                  Cookies.remove("access");
                  Cookies.remove("principal");
                  this.$store.commit("clearOpenedSubmenu");
                  localStorage.clear();
                  sessionStorage.clear();
                  this.resetpwd = false;
                  this.$Modal.info({
                    title: '当前登录信息已失效，请重新登录！',
                    okText: '确定',
                    onOk: () => {
                      this.$router.push({
                        name: 'login'
                      });
                    }
                  });
                }, 500);
              } else {
                this.$Message.info(res.msg);
              }
            });
        }
      });
    },
  },
  mounted() {
    // this.resetPwd();
    this.getListForSysmessage();
    this.getListForMeeting();
    this.getListForTrain();
    this.isMatchMenu();
    this.getUserInfo();
    this.supervisorQuery();
    this.getWorkListForOrphan();
    this.getWorkListForInvalid();
    this.getWorkListForHandover();
    this.queryCare();
    // this.getNumberByuseragentcode();
    this.selectByExample();
    this.getIndexComment();
    this.getAchievingRate();
  },
};
</script>

<style scoped lang="less">
@import "./index";
</style>

<style scoped>
.card-div {
  position: relative;
  height: 385px;
  background: #ffffff;
  border-radius: 8px;
}

.box-title {
  position: relative;
  height: 50px;
  border-bottom: 1px solid #f2f2f2;
}

.line {
  width: 4px;
  height: 16px;
  background: #ff4722;
  margin-right: 20px;
}

.more {
  position: absolute;
  right: 20px;
  font-weight: 400;
  color: #999999;
  font-size: 14px;
}

.radio-box {
  position: absolute;
  right: 20px;
  margin-top: 20px;
  color: #666666;
}

.radio-box>div {
  display: inline-block;
  width: 92px;
  height: 32px;
  text-align: center;
  line-height: 32px;
  border-radius: 8px;
  border: 1px solid #eeeeee;
}

.active {
  background: #082AFF;
  color: #fff;
  /* background: #fff4ed;
  color: #ff4722; */
  font-weight: 500;
  border: none !important;
}

.echarts-box {
  display: flex;
  justify-content: space-around;
  align-content: center;
  margin-top: 72px;
}

.echarts-item {
  display: flex;
  flex-direction: column;
  align-content: space-between;
  justify-items: center;
  margin-left: 5px;
}

.echarts-byte {
  position: relative;
  display: flex;
  justify-content: space-between;
  margin-top: 8px;
}

.crl {
  position: absolute;
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 6px;
  left: -14px;
  top: 8px;
}

.achievementRate0 {
  background: #f88d67;
}

.achievementRate1 {
  background: #58ca86;
}

.achievementRate2 {
  background: #a09fff;
}

.rating-box {
  margin: 15px 20px;
  padding-bottom: 15px;
  font-size: 16px;
  font-weight: 500;
  color: #2a2a2a;
  border-bottom: 1px solid #eee;
}
</style>

<style lang="less">
.ivu-table .demo-table-info-row td {
  background-color: #ffffff;
}

.ivu-table .demo-table-error-row td {
  background-color: #fff6f5;
}

.ivu-card-head p,
.ivu-card-head-inner {
  height: 30px;
  line-height: 30px;
}

.endTag .ivu-tag-text {
  color: #a6a6a6 !important;
}

.pswModal .ivu-modal-header {
  background-color: #2d8cf0;
}

.ivu-modal-header-inner {
  color: #fff !important;
}

.pswModal .ivu-modal-mask {
  z-index: 10086 !important
}

.pswModal .ivu-modal-wrap {
  z-index: 10087 !important
}
</style>
